<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/preview.css">
    <link rel="stylesheet" href="../css/header.css">
    <link rel="stylesheet" href="../css/nav.css">
    <link rel="stylesheet" href="../css/footer.css">
    <link rel="stylesheet" href="../css/产品中心.css">
</head>

<body>
    <div class="box">

        <!-- 网页的头部 begin -->
        <header>
            <div class="container">
                <!-- logo -->
                <div class="logo">
                    <img class="auto-img" src="../images/logo.png" alt="">
                </div>

                <!-- tel -->
                <div class="tel">
                    <img class="auto-img" src="../images/phone.png" alt="">
                </div>
            </div>
        </header>
        <!-- 网页的头部 end -->


             <!-- 导航栏 begin -->
             <nav>
                <div class="container">
                    
                    <!-- 左边列表 -->
                    <ul class="list">
    
                        <a href="../index.html">
                            <li>网站首页</li>
                        </a>
                        
                        <a href="./公司简介.html">
                            <li>关于宏恩
                                <ul>
                                    <li>公司简介</li>
                                    <li>发展历程</li>
                                    <li>企业文化</li>
                                    <li>组织机构</li>
                                    <li>企业荣誉</li>
                                </ul>
                            </li>
                        </a>
                        
                        <a href="javascript:;">
                            <li  class="active">产品中心</li>
                        </a>
    
                        <a href="./新闻中心.html">
                             <li>新闻中心
                                 <ul>
                                     <li>公司动态</li>
                                     <li>行业聚焦</li>
                                 </ul>
                             </li>
                        </a>
    
                        <a href="javascript:;">
                            <li>人才招聘
                                <ul>
                                    <li>人才理念</li>
                                    <li>办公环境</li>
                                    <li>社会招聘</li>
                                    <li>校园招聘</li>
                                </ul>
                            </li>
                        </a>
    
                        <a href="javascript:;">
                            <li>联系我们</li>
                        </a>
                    </ul>
    
                    <!-- 右边输入框 -->
                    <div class="ipt">
                        <input type="text" placeholder="请输入您想搜索的内容">
                        <div>
                            <img class="auto-img" src="../images/search1.png" alt="">
                        </div>
                    </div>
    
    
                </div>
            </nav>
            <!-- 导航栏 end -->

        <!-- 轮播图 begin -->
        <div class="banner">
            <img class="auto-img" src="../images/banner-3.jpg" alt="">
        </div>
        <!-- 轮播图 end -->


        <!-- 页面主体内容 begin -->
        <main>

            <div class="container clearflow">

                <!-- 左边侧边栏 begin -->
                <aside>
                    <li>产品中心</li>
                    <li class="active">精品设计</li>
                    <li>基础工程</li>
                    <li>房建工程</li>
                    <li>市政工程</li>
                    <li>轧道工程</li>
                </aside>
                <!-- 左边侧边栏 end -->


                <!-- 产品中心 begin -->
                <article class="fr">

                    <!-- 面包屑导航 begin -->
                    <div class="breadcrumb">
                        当前位置：
                        <a href="../index.html">首页</a> >
                        产品中心
                    </div>
                    <!-- 面包屑导航 end-->


                    <!-- 作品展示 begin -->
                    <ul id="show" class="list">
                        <a href="./产品详情.html#detail">
                            <img class="auto-img" src="../images/5.png" alt="">
                            阳光花园
                        </a>
                        <a href="./产品详情.html#detail">
                            <img class="auto-img" src="../images/3.png" alt="">
                            格林海景花园
                        </a>
                        <a href="./产品详情.html#detail">
                            <img class="auto-img" src="../images/4.png" alt="">
                            世界商业大厦
                        </a>
                        <a href="./产品详情.html#detail">
                            <img class="auto-img" src="../images/5.png" alt="">
                            阳光花园
                        </a>
                        <a href="./产品详情.html#detail">

                            <img class="auto-img" src="../images/3.png" alt="">
                            格林海景花园
                        </a>
                        <a href="./产品详情.html#detail">

                            <img class="auto-img" src="../images/4.png" alt="">
                            世界商业大厦
                        </a>
                        <a href="./产品详情.html#detail">

                            <img class="auto-img" src="../images/5.png" alt="">
                            阳光花园
                        </a>
                        <a href="./产品详情.html#detail">

                            <img class="auto-img" src="../images/3.png" alt="">
                            格林海景花园
                        </a>
                        <a href="./产品详情.html#detail">

                            <img class="auto-img" src="../images/4.png" alt="">
                            世界商业大厦
                        </a>
                    </ul>
                    <!-- 作品展示 end -->


                    <!-- 分页器 begin -->
                    <ul class="bullets">
                        <li>&lt;</li>
                        <li class="active">1</li>
                        <li>2</li>
                        <li>&gt;</li>
                    </ul>
                    <!-- 分页器 end -->

                </article>
                <!-- 产品中心 end -->

                
             


            </div>


        </main>
        <!-- 页面主体内容 end -->


        <!-- 页脚 begin -->
        <footer>
            <div class="container">
                版权所有：广州市建筑集团有限公司 京ICP备11009138号 京公网安备:110401300085 技术支持：中企动力
            </div>
        </footer>
        <!-- 页脚 end -->
    </div>
</body>

</html>